<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JS_获取对象的方式</title>
	<script>
		window.onload = function (){



			/**获取HTML文档中所有的class属性名相同的一些元素对象.*/
			var liArray = document.getElementsByClassName("li");
			for (let i = 0; i < liArray.length; i++) {
				liArray[i].style.backgroundColor = 'red';
			}

			/**获取HTML文档中所有的name名相同的一些元素对象**/
			// var iptArray = document.getElementsByName("user");
			// iptArray[0].value = 'Hello';
			// iptArray[1].value = "world";

			/**获取HTML文档中所有的指定标签元素对象.*/
			/*var divArray = document.getElementsByTagName("div");
			console.log(divArray.length);
			for(var i = 0 ;i<divArray.length;i++){
				divArray[i].innerHTML="Hello World!!!";
			}*/

			/**需要对一个元素进行操作的话,用getElementById */
			// document.getElementById("div1").innerHTML="Hello World!!!";
		}
		function fun1(e){
			e.preventDefault();//阻止默认行为
		}
	</script>
</head>
<body>

	<div id="div1"></div>
	<div ></div>

	<div>
		<!--submit点击时,激活的form表单的form.submit()-->
		<form action="#"  >
			<input type="text" name="user" >
			<input type="password" name="user" >
			<input type="submit" id="sub" onclick="fun1(event)" >
		</form>
	</div>

	<div>
		<ul>
			<li class="li">li1</li>
			<li class="li">li2</li>
			<li class="li">li3</li>
		</ul>
	</div>

</body>
</html>